<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Professional | Matrimony Premium Admin </title>
        <link rel="stylesheet" href="css/style.css" type="text/css" />
        <script type="text/javascript">
            function mydelete() {
                return confirm('co xoa khong');
            }
        </script>
        <script type="text/javascript" src="js/plugins/jquery-1.7.min.js"></script>
        <script type="text/javascript" src="js/plugins/jquery.flot.min.js"></script>
        <script type="text/javascript" src="js/plugins/jquery.flot.resize.min.js"></script>
        <script type="text/javascript" src="js/plugins/jquery-ui-1.8.16.custom.min.js"></script>
        <script type="text/javascript" src="js/custom/general.js"></script>
        <script type="text/javascript" src="js/custom/dashboard.js"></script>
        <!--[if lt IE 9]>
                <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
        <![endif]-->
    </head>
    <body class="loggedin">

        <!-- START OF HEADER -->
        <div class="header radius3">
            <div class="headerinner">

                <a href="#"><img src="images/starlight_admin_template_logo_small.png" alt="" /></a>


                <div class="headright">
                    <div class="headercolumn"></div>
                    <div id="searchPanel" class="headercolumn">
                        <div class="searchbox">
                            <form action="#" method="post">
                                <input type="text" id="keyword" name="keyword" class="radius2" value="Search here" /> 
                            </form>
                        </div><!--searchbox-->
                    </div><!--headercolumn-->
                    <div id="notiPanel" class="headercolumn">
                        <div class="notiwrapper">
                            <a href="ajax/messages.html" class="notialert radius2">5</a>
                            <div class="notibox">
                                <ul class="tabmenu">
                                    <li class="current"><a href="ajax/messages.html" class="msg">Messages (2)</a></li>
                                    <li><a href="ajax/activities.html" class="act">Recent Activity (3)</a></li>
                                </ul>
                                <br clear="all" />
                                <div class="loader"><img src="images/loaders/loader3.gif" alt="Loading Icon" /> Loading...</div>
                                <div class="noticontent"></div><!--noticontent-->
                            </div><!--notibox-->
                        </div><!--notiwrapper-->
                    </div><!--headercolumn-->
                    <div id="userPanel" class="headercolumn">
                        <a href="#" class="userinfo radius2">
                            <img src="images/avatar.png" alt="" class="radius2" />
                            <span><strong>Justin Meller</strong></span>
                        </a>
                        <div class="userdrop">
                            <ul>
                                <li><a href="#">Profile</a></li>                                
                                <li><h:form><h:commandLink action="#{loginBean.logOut()}">Logout</h:commandLink></h:form></li>
                            </ul>
                        </div><!--userdrop-->
                    </div><!--headercolumn-->
                </div><!--headright-->

            </div><!--headerinner-->
        </div><!--header-->
        <!-- END OF HEADER -->

        <!-- START OF MAIN CONTENT -->
        <div class="mainwrapper">
            <div class="mainwrapperinner">

                <div class="mainleft">
                    <div class="mainleftinner">

                        <div class="leftmenu">
                            <ul>
                                <li><a href="home.xhtml" class="dashboard"><span>Accounts</span></a></li>
                                <li class="current"><a href="professional.xhtml" class="widgets"><span>professional</span></a>
                                    <ul>
                                        <li><a href="form.html"><span>Form Styling</span></a></li>
                                        <li><a href="editor.html"><span>WYSIWYG Editor</span></a></li>
                                        <li><a href="wizard.html"><span>Wizard</span></a></li>
                                    </ul>
                                </li>
                                <li><a href="ReligionManager.xhtml" class="tables"><span>RELIGION</span></a></li>
                                <li><a href="citiesManager.xhtml" class="elements"><span>CityManager</span></a></li>
                                <li><a href="countryManager.xhtml" class="charts"><span>CountryManager</span></a></li>
                                <li><a href="casteManager.xhtml" class="grid"><span>CasteManager</span></a></li>    
                                <li><a href="paymentManager.xhtml" class="editor menudrop active"><span>Payment</span></a></li>
                                <li><a href="ImagerManager.xhtml" class="media"><span>ImageManager</span></a></li>
                                <li><a href="FeedbackManager.xhtml" class="tables"><span>FeedBackManager</span></a></li>
                                <li><a href="Advertisement.xhtml" class="charts"><span>Advertisement</span></a></li>
                            </ul>

                        </div><!--leftmenu-->
                        <div id="togglemenuleft"><a></a></div>
                    </div><!--mainleftinner-->
                </div><!--mainleft-->



                <div class="maincontent">
                    <div class="maincontentinner">

                        <ul class="maintabmenu">
                            <li class="current"><a href="home.xhtml">Professional</a></li>
                        </ul><!--maintabmenu-->

                        <div class="content">
                            <ul class="widgetlist">
                                <li><a href="home.xhtml" class="events"></a></li>
                                <li><a href="" class="message"> </a></li>
                                <li><a href="" class="upload"> </a></li>
                                <li><a href="" class="events"></a></li>
                                <li><a href="" class="message"> </a></li>
                            </ul>

                            <br clear="all" /><br />

                            <div class="contenttitle">
                                <h2 class="chart"><span>Professional</span></h2>
                            </div><!--contenttitle-->
                            <br />
                            <f:view>
                                <h:form>
                                    <h:dataTable  value="#{professionalBean.loadProfessional()}" var="pro" width="90%" border="10"  >
                                        <h:column>
                                            <f:facet name="header">
                                                <h:outputText value="Professional Id"/>                                                                                           
                                            </f:facet>
                                            <h:inputText value="#{pro.proId}" rendered="#{pro.editable}"/>
                                            <h:outputText value="#{pro.proId}"/>
                                        </h:column>
                                        <h:column>
                                            <f:facet name="header">
                                                <h:outputText value="Professional Status"/>
                                            </f:facet>
                                            <h:selectBooleanCheckbox value="#{pro.proStatus}" rendered="#{pro.editable}"/>    
                                            <h:outputText value="#{pro.proStatus}" rendered="#{not pro.editable}"/>

                                        </h:column>
                                        <h:column>
                                            <f:facet name="header">
                                                <h:outputText value="Professional name"/>
                                            </f:facet>
                                            <h:inputText value="#{pro.proName}" rendered="#{pro.editable}"/>
                                            <h:outputText value="#{pro.proName}" rendered="#{not pro.editable}"/>

                                        </h:column>
                                        <h:column>
                                            <f:facet name="header">
                                                <h:outputText value="Delele"/>
                                            </f:facet>
                                            <h:commandLink value="Delete" action="#{professionalBean.deleteProfessional(pro.proId)}" onclick="return mydelete()"/>

                                        </h:column> 
                                        <h:column >
                                            <f:facet name="header">
                                                <h:outputText value="Edit"/>
                                            </f:facet>
                                            <h:commandLink value="Edit" action="#{professionalBean.editAction(pro.proId, pro.proName,pro.proStatus)}" rendered="#{not  pro.editable}"/>

                                        </h:column>
                                    </h:dataTable>

                                </h:form>                             
                                <div class="contenttitle">
                                    <h2 class="form"><span>Insert Professional</span></h2>
                                </div>

                                <br />

                                <h:form id="form2" class="stdform stdform2" >
                                    <p>
                                        <label>Professional Status</label>
                                        <span class="field">

                                            <h:selectBooleanCheckbox  value="#{professionalBean.proStatus}"/>
                                        </span>
                                    </p>

                                    <p>
                                        <label>Professional Name</label>
                                        <span class="field">
                                            <h:inputText value="#{professionalBean.proName}" class="longinput" id="name" required="true" requiredMessage="Professional can not null"/>
                                            <h:message for="name" errorStyle="color:red"/>
                                        </span>
                                    </p>
                                    <p class="stdformbutton">
                                        <h:commandButton value="Insert" class="submit radius2" action="#{professionalBean.insertProfessional()}"/>
                                        <h:commandButton value="Reset " class="reset radius2" actionListener="#{professionalBean.reset()}" />  
                                    </p>
                                </h:form>


                            </f:view>
                            <br clear="all" /><br />                     	                        
                        </div>content

                    </div><!--maincontentinner-->

                    <div class="footer">
                        <p>Starlight Admin Template copy 2012. All Rights Reserved. Designed by: <a href="#">Matrimony.com</a></p>
                    </div><!--footer-->

                </div><!--maincontent-->

                <div class="mainright">
                    <div class="mainrightinner">

                        <div class="widgetbox">
                            <div class="title"><h2 class="chart"><span>Visitors Overview</span></h2></div>
                            <div class="chartbox widgetcontent">
                                <div id="chartplace" class="chartplace"></div>

                                <div class="one_half">
                                    <div class="analytics analytics2">
                                        <small>Visitors For Today</small>
                                        <h1>23 321</h1>
                                        <small>18,222 unique</small>
                                    </div><!--visitoday-->
                                </div><!--one_half-->

                                <div class="one_half last">

                                    <div class="one_half">
                                        <div class="analytics">
                                            <small>bounce</small>
                                            <h3>23.2%</h3>
                                        </div><!--analytics-->
                                    </div><!--one_half-->

                                    <div class="one_half last">
                                        <div class="analytics textright">
                                            <small class="block">visitors</small>
                                            <h3>56.8%</h3>
                                        </div><!--analytics-->
                                    </div><!--one_half last-->
                                    <br clear="all" />

                                    <div class="analytics average margintop10">
                                        Average <h3>87.44%</h3>
                                    </div><!--analytics-->

                                </div><!--one_half-->


                                <br clear="all" />
                            </div><!--widgetcontent-->
                        </div><!--widgetbox-->


                        <div class="widgetbox">
                            <div class="title"><h2 class="calendar"><span>Event Calendar</span></h2></div>
                            <div class="widgetcontent padding0">
                                <div id="datepicker"></div>
                            </div><!--widgetcontent-->
                        </div><!--widgetbox-->

                        <div class="widgetbox">
                            <div class="title"><h2 class="tabbed"><span>Tabbed Widget</span></h2></div>
                            <div class="widgetcontent padding0">
                                <div id="tabs">
                                    <ul>
                                        <li><a href="#tabs-1">Products</a></li>
                                        <li><a href="#tabs-2">Posts</a></li>
                                        <li><a href="#tabs-3">Media</a></li>
                                    </ul>
                                    <div id="tabs-1">
                                        <ul class="listthumb">
                                            <li><img src="images/thumb/small/thumb1.png" alt="" /> <a href="#">Proin elit arcu, rutrum commodo</a></li>
                                            <li><img src="images/thumb/small/thumb2.png" alt="" /> <a href="#">Aenean tempor ullamcorper leo</a></li>
                                            <li><img src="images/thumb/small/thumb3.png" alt="" /> <a href="#">Vehicula tempus, commodo a, risus</a></li>
                                            <li><img src="images/thumb/small/thumb4.png" alt="" /> <a href="#">Donec sollicitudin mi sit amet mauris</a></li>
                                            <li><img src="images/thumb/small/thumb5.png" alt="" /> <a href="#">Curabitur nec arcu</a></li>
                                        </ul>
                                    </div>
                                    <div id="tabs-2">
                                        <ul>
                                            <li><a href="#">Proin elit arcu, rutrum commodo</a></li>
                                            <li><a href="#">Aenean tempor ullamcorper leo</a></li>
                                            <li><a href="#">Vehicula tempus, commodo a, risus</a></li>
                                            <li><a href="#">Donec sollicitudin mi sit amet mauris</a></li>
                                            <li><a href="#">Curabitur nec arcu</a></li>
                                        </ul>
                                    </div>
                                    <div id="tabs-3">
                                        <ul class="thumb">
                                            <li><a href="#"><img src="images/thumb/xsmall/thumb1.png" alt="" /></a></li>
                                            <li><a href="#"><img src="images/thumb/xsmall/thumb2.png" alt="" /></a></li>
                                            <li><a href="#"><img src="images/thumb/xsmall/thumb3.png" alt="" /></a></li>
                                            <li><a href="#"><img src="images/thumb/xsmall/thumb4.png" alt="" /></a></li>
                                            <li><a href="#"><img src="images/thumb/xsmall/thumb5.png" alt="" /></a></li>
                                            <li><a href="#"><img src="images/thumb/xsmall/thumb6.png" alt="" /></a></li>
                                            <li><a href="#"><img src="images/thumb/xsmall/thumb7.png" alt="" /></a></li>
                                            <li><a href="#"><img src="images/thumb/xsmall/thumb8.png" alt="" /></a></li>
                                        </ul>     
                                    </div>
                                </div><!--#tabs-->
                            </div><!--widgetcontent-->
                        </div><!--widgetbox-->

                    </div><!--mainrightinner-->
                </div><!--mainright-->    
            </div><!--mainwrapperinner-->
        </div><!--mainwrapper-->
        <!-- END OF MAIN CONTENT -->


    </body>
</html>
